@extends('edu.layouts.master')
@section('content')
    <div class="container">
        <div class="row mt-3">
            <div class="col-9">
                {{--调用route_class()根据当前路由生成一个cas类名,这样后期写css样式的时候根据这个类名就知道这个样式要用到哪里了--}}
                <div class="card card-body p-5 {{route_class()}}">
                    <div class="row">
                        <div class="col text-right">
                            @can('store',$topic)
                                <a class="badge badge-primary" href="{{route('edu.store',['EduTopic',$topic['id']])}}">收藏</a>
                            @endcan
                            @can('delete',$topic)
                                <a class="badge badge-light" href="javascript:;"
                                   onclick="confirm('确定删除吗')?$(this).next().submit():''">删除</a>
                                <form action="{{route('edu.topic.destroy',$topic)}}" method="post">
                                    @csrf @method('DELETE')
                                </form>
                            @endcan
                        </div>
                    </div>
                    <div class="row">
                        <div class="col text-center">
                            <h2 class="mb-2">
                                {{$topic->title}}
                            </h2>
                            <p class="text-muted small">
                                <span class="fe fe-user mr-1"></span> {{$topic->user->name}} <span
                                        class="fe fe-clock mr-1"></span> {{$topic->updated_at->diffForHumans()}}
                            </p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <hr class="my-5">
                            {{$topic->content}}
                            <div class="markdown text-muted mb-0" id="content">
                                <textarea hidden> {{$topic->content}}</textarea>
                            </div>
                            @push('js')
                                <script>
                                    require(['hdjs', 'marked', 'MarkdownIt', 'highlight'], function (hdjs, marked, MarkdownIt) {
                                        //转markdown为html
                                        let md = new MarkdownIt();
                                        $("#content").html(md.render($("#content textarea").val()));

                                        //代码高亮
                                        $('pre code').each(function (i, block) {
                                            hljs.highlightBlock(block);
                                        });
                                    })
                                </script>
                            @endpush
                        </div>
                        <hr>
                        <div class="col-12 mt-3">
                            <div class="text-center">
                                {{--下面是通过EduTopic模型策略进行判断帖子的作者不能自己给自己点赞--}}
                                @can('zan',$topic)
                                    <a class="btn btn-primary"
                                       href="{{route('edu.zan',['EduTopic',$topic['id']])}}">点赞</a>
                                @endcan
                                <div class="mt-2">
                                    {{--通过$topic->zan可以将EduZan模型表中zan_type是$topic模型(App\Models\EduTopic),zan_id为$topic['id']的所有记录集合返回出来--}}
                                    @foreach($topic->zan as $zan)
                                        <div class="avatar">
                                            <img class="avatar-title rounded-circle" src="{{$zan->user->icon}}"/>
                                        </div>
                                    @endforeach
                                </div>
                                <hr>
                                <div class="mt-2">
                                    {{--通过$topic->store可以将EduStore模型表中store_type是$topic模型(App\Models\EduTopic),store_id为$topic['id']的所有记录集合返回出来(收藏数)--}}
                                    @foreach($topic->store as $store)
                                        <div class="avatar">
                                            <img class="avatar-title rounded-circle" src="{{$store->user->icon}}"/>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                {{--使用include引入别的模板的时候还可以传递参数过去--}}
                @include('common.comment',['model'=>$topic])
            </div>
            <div class="col-3">
                <div class="card">
                    <div class="card-header">
                        <div class="text-center">
                            {{$topic->user->name}}
                        </div>
                    </div>
                    <div class="card-body text-center">
                        <div class="avatar avatar-xxl">
                            <a href="{{route('user.space.home',$topic->user)}}">
                                <img src="{{$topic->user->icon}}" class="avatar-img rounded-circle">
                            </a>
                        </div>
                    </div>
                    @can('follow',$topic->user)
                        <div class="card-footer text-muted text-center">
                            @if($topic->user->isFans(auth()->user()))
                                <a href="{{route('user.follow',$topic->user->id)}}"
                                   class="btn btn-primary btn-sm">已关注</a>
                            @else
                                <a href="{{route('user.follow',$topic->user->id)}}" class="btn btn-light btn-sm">关注</a>
                            @endif
                        </div>
                    @endcan
                </div>
            </div>
        </div>
    </div>
    </div>
@endsection